{#<style>#}
{#    .classes-box {#}
{#        margin: 0 20px 10px;#}
    {# 上 左右 下 #}
{#border-radius: 14px;#}
{#        box-shadow: rgb(99, 99, 99, 0.2) 0 2px 8px 0;#}
{#        display: flex;#}
{#        padding: 20px;#}
{#    }#}
{##}
{#    .classes-box li {#}
{#        height: 20px;#}
{#        margin-right: 40px;#}
{#        color: darkslateblue;#}
{#    }#}
{##}
{#    .classes-box li a {#}
{#        display: flex;#}
{#        margin-bottom: auto;#}
{#        border-radius: 10px;#}
{#        margin-right: 2em;#}
{#    }#}
{#</style>#}

{# 首页 #}
<ul class="classes-box">
    {% for i in classes %} {# 迭代分类名 #}
        <li>
            <a href="/Z/nav/{{ i.name }}"
                    {% if now_cls == i.name %} style=" background-color: darkgray" {% endif %} >
                {{ i.name | capfirst}} {# capfirst 首字母大写 #}
            </a>
        </li>
    {% endfor %}
</ul>